.w-container{  // 页面主体样式
	background: #fff;
	border-radius: 4px;
	padding: 15px 12px;
	overflow-x:auto;
	height: 100%;
	.w-title{
		font-size: 18px; margin-bottom: 15px;
	}
}

.w-tabHead > th{
	text-align: center;
}

.w-tabBtn{
	color: $elm_theme-color;
	cursor: pointer;
  padding: 0 3px;
  display: inline-block;
  i{
    font-size: 22px;
    position: relative;
    top: 2px;
    margin: 0 5px;
  }
}

.w-tabBtn-red{
  color: #f56c6c;
  cursor: pointer;
  padding: 0 3px;
  display: inline-block;
}

.w-align-r{text-align: right}

.w-query-search{ // 基础查询样式
  li{
    float: left;
    width: 280px;
    margin-right: 2%;
    margin-bottom: 10px;
    .el-range-editor {
      width: 200px !important;
      height: 28px;
      i {
        line-height: 21px;
        font-size: 12px;
      }
    }
    .el-range-input {
      font-size: 12px;
    }
    .el-range-separator {
      width: auto;
      font-size: 12px;
      line-height: 20px;
    }
    .el-date-editor {
      .el-range__icon {
        margin-left: -10px;
      }
      .el-range__close-icon {
        width: auto;
        font-size: 12px;
        margin-right: -4px;
      }
    }
    &:last-child{
      width: auto;
      margin-right: 0;
      float: right;
    }
  }
  li > label{font-size:12px;font-weight:normal;width:72px;text-align:right;display:inline-block;white-space:nowrap;color:#666;
    float:left;line-height: 28px;margin-right: 5px}
  .el-input, .el-select, .el-date-picker{width:200px}
  .number{width:84px}
  &:after{
    clear:both;content:"";display:block
  }
}

.w-date-range{
  width: 200px !important;
  height: 28px !important;
  i {
    line-height: 21px;
    font-size: 12px;
  }
  .el-range__icon {
    margin-left: -10px;
    margin-top: -6px;
  }
  .el-range__close-icon {
    width: auto;
    font-size: 12px;
    line-height: 20px;
    margin-left: 4px;
  }
  .el-range-input{ font-size: 12px !important }
  .el-range-separator{ line-height: 20px !important; font-size: 12px; padding: 0 }
}

.w-dialogBtn{  // 弹出框按钮样式
  margin-top: 20px;
  text-align: center
}

.imgUpLoad {
  ul{padding:10px;  // 图片上传样式
    &:after{content:"";display:block;clear:both}
    li{float:left;width:120px;height:120px;border-radius:8px;border:1px solid #eee;position:relative;text-align:center;margin:0 15px 15px 0;overflow:hidden;
      &:last-child i{font-size:50px;color:#409EFF;line-height:90px;cursor:pointer}
      &:last-child > div{margin-top: -8px;font-size: 14px;color:#409EFF}
      .el-progress{position:absolute;left:4px;top:4px;z-index:100}
      .pdf-bord, img{max-width:100%;max-height:100%;opacity:0;transition:all .5s;transform:translateY(-20px);position:absolute;left:0;right:0;bottom:0;top:0;margin:auto}
      .showImg{opacity:1;transform:translateY(0px)}
      .pdf-bord:before{position: absolute;left: 0;top: 0;height: 100%;width: 100%;z-index: 10;display: block;content: '';background: rgba(255,255,255,.05)}
      iframe{width: 140%;height: 200%;overflow: hidden;position: absolute;left: -10%;top: -75%;z-index:5}
      iframe.boxMode{top: -54%}
      .operate{position:absolute;bottom:0;transition:all .5s;left:0;width:100%;transform:translateY(36px);height:36px;line-height:20px;z-index:50;background:rgba(0,0,0,.5);color:#fff;display:flex;padding:8px 0}
      .operate span{text-align:center;flex:1;position:relative;font-size:18px;border-right:1px solid #ccc;overflow:hidden}
      .operate span:last-child{border-right:none}
      .operate span:hover i{color:#a3d0fd}
      &:hover > .operate{transform:translateY(0)}
      input{position:absolute;left:0;top:0;width:100%;height:100%;opacity:0;z-index:10;cursor:pointer}
      //.el-icon-circle-close{position:absolute;right:0px;top:0px;cursor:pointer;font-size:24px;color:#999}
    }
    li.mini{width: 80px; height: 80px; margin: 0 10px 10px 0;
      &:last-child i{line-height:60px;font-size: 42px}
      .operate{padding: 4px 0;height: 28px}
    }
    li.large{width: 150px; height: 150px;
      &:last-child i{line-height:118px}
    }
  }
  p{color: #999; font-size: 12px; margin: -10px 0 20px 10px}
  .screen-box > img{max-width:100%; max-height: 100%}
}

.w-detail{border-right: 1px solid #D8DCE4; border-bottom: 1px solid #D8DCE4;  // 详情展示样式
  li{float:left;width: 33.33%;line-height: 36px;height: 36px;border:1px solid #D8DCE4;position: relative;border-bottom:none;border-right:none;overflow:hidden;white-space: nowrap; text-overflow:ellipsis}
  li > label{display: inline-block; width:100px; text-align: right; font-weight: normal;border-right: 1px solid #D8DCE4;background: #F7F8FA;margin-right: 6px}
  &:after{content: ""; display: block;clear: both}
  .uploadFile li{margin: 5px 0;width: 435px; border:none}
}

.w-dialog-modify{
  .w-subbtn{ // 底部的提交、取消按钮
    width:100%;
    height:60px;
    display: flex;
    justify-content: center;
    align-items: center;
    .el-button:not(:last-child){
      margin-right:40px;
    }
  }
  .el-dialog__body{ // 调小边距
    padding-top: 35px;
    padding-bottom: 10px;
  }
}
.w-subbtn{ // 底部的提交、取消按钮
  width:100%;
  height:60px;
  display: flex;
  justify-content: center;
  align-items: center;
  .el-button:not(:last-child){
    margin-right:40px;
  }
}
.w-must-null{ // 必填项
  .el-input__inner,.el-textarea__inner{
    border: 1px solid #ff9393!important;
  }
  .imgUpLoad li{
    border: 1px solid #ff9393!important;
  }
}
.w-must-null-date{border: 1px solid #ff9393}

// 编号，蓝色，点击后显示详情
.w-no{
  color: $elm_theme-color;
  cursor: pointer;
  margin:0 10px;
}
.w-red{
  cursor: pointer;
  color: red;
  margin: 0 10px;
}
.w-gray{
  color: #ddd;
  cursor: not-allowed;
  margin-left: 10px;
}
.w-title-blue{
  color: #333;
  font-size: 16px;
  height: 22px;
  line-height:20px;
  margin: 18px 0;
  text-indent: 10px;
  border-left:2px solid $elm_theme-color;
}
.w-title-md{
  font-size: 17px;
  height: 22px;
  line-height:20px;
  margin-bottom: 15px;
  text-indent: 10px;
  border-left:3px solid $elm_theme-color;
  color: #606266;
  ::after{
    display: block;
    content: '';
    border-bottom:2px solid #f5f2fa;
  }
}
.w-infoLine{
  padding: 0 13px;
  li{
    color: $elm-font-main;
    margin-right: 100px;
    display: inline-block;
    font-size: 12px;
    label{
      color: $elm-font-sub; font-weight: normal;
    }
  }
}

.w-import-form{  // 导入弹出框表单样式
  border: 1px solid #D8DCE4;
  line-height: 36px;
  display: flex;
  margin-bottom: 20px;
  li{
    flex: 1;
    border-right: 1px solid #D8DCE4;
    .treeContain{
      display: block;
      border: none;
    }
  }
  li:last-child{border-right: none}
  li > p{text-align: center;background: #F7F8FA;border-bottom: 1px solid #D8DCE4;color: #333}
  .el-select, .el-input{width: 100%}
  .el-input__inner{border: none; background: none;width: 100%}
}

.w-grayLine{
  height:24px;
  background: $gray;
  border-radius:3px;
  padding: 0 8px;
  font-size: 12px;
  color: $elm-font-normal;
  line-height: 24px;
  li{
    display: inline-block; margin-right: 60px
  }
}
ul.w-border-table{
  @include wBorderTable(4, 20%, 30%)
}
ul.w-border-table-6{
  @include wBorderTable(6, 15%, 18.33%)
}
ul.w-special-table{
  width: 100%;
  border-top:1px solid #D8DCE4;
  border-left:1px solid #D8DCE4;
  font-size: 12px!important;
  .head{
    background-color: #EBECF0;
    border-color: #D8DCE4;
  }
  li{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    >div{
      word-break:break-all!important;
      border-bottom:1px solid #D8DCE4;
      border-right:1px solid #D8DCE4;
      line-height: 25px;
      padding: 8px;
    }
  }
  .no-data{
    height: 40px;
    line-height: 40px;
    border-right: 1px solid #D8DCE4;
    border-bottom: 1px solid #D8DCE4;
    justify-content: center;
  }
}
.w-special-select{
  border: 1px solid #dcdfe6;
  color: #606266;
  padding: 0 15px;
  border-radius: 3px;
  height: 28px !important;
  line-height: 28px;
  font-size: 12px!important;
}
.w-special-button{
  background-color: #5584FF;
  border:1px solid  #5584FF;
  border-radius: 3px;
  padding: 7px 15px;
  color: #fff;
  font-size: 12px!important;
}
.w-el-tree-modify{
  font-size: 12px!important;
}
.w-el-tree-modify .el-tree-node.is-current>.el-tree-node__content{
    background-color: #e6f1fc;
    color:#409EFF;
    font-weight:800;
}
.w-el-tree-modify .el-tree-node__content:hover{
    color:#409EFF!important;
    background-color: #e6f1fc;
}
.w-el-tree-modify .el-tree-node__content{
    height:30px;
}
.w-label-border-table-1{
  @include wLabelBorderTable(1, 100%, 30%)
}
.w-label-border-table-2{
  @include wLabelBorderTable(2, 50%, 30%);
  .occupy-row{
    width:100%;
    border-right: none;
    >label{
      flex: 0 0 14.9%;
    }
  }
}
.w-label-border-table-3{
  @include wLabelBorderTable(3, 33.33%, 35%)
}
.w-label-border-table-4{
  @include wLabelBorderTable(4, 25%, 35%)
}
.w-label-table-1{
  @include wLabelTable(1, 100%, 30%)
}
.w-label-table-2{
  @include wLabelTable(2, 50%, 30%)
}
.w-label-table-3{
  @include wLabelTable(3, 33.33%, 35%)
}
.w-label-table-4{
  @include wLabelTable(4, 25%, 35%)
}
.w-table-border-table{
  width:100%;
  thead {
    width: calc( 100% - 1em );
    display:table;
    width:100%;
    table-layout:fixed;
  }
  th{
    border-top: 1px solid #D8DCE4;
    border-left: 1px solid #D8DCE4;
    height:36px;
    line-height:36px;
    font-size:14px;
    color:#333;
    background-color: #EBECF0;
    color: #333;
    font-weight: 400;
  }
  th:last-child{
    border-right: 1px solid #D8DCE4;
  }
  tbody {
    display:block;
    overflow-y:auto;
  }
  tr{
    display:table;
    width:100%;
    table-layout:fixed;
    td:first-child{
      text-align: center;
    }
    td:last-child{
      border-right: 1px solid #D8DCE4;
    }
  }
  tr:last-child{
    td{
      border-bottom: 1px solid #D8DCE4;
    }
  }
  td{
    padding: 3px;
    border-top: 1px solid #D8DCE4;
    border-left: 1px solid #D8DCE4;
    color:#333;
    font-size:12px;
    padding: 6px;
  }
}
.w-width-200{width: 200px;}
.w-width-220{width: 220px;}
.w-width-150{width: 150px;}
.w-view{
  position:fixed;left:0;top:0;width:100%;height:100%;overflow:auto;display:flex;
  justify-content:center;align-items:center;display:-webkit-box;-webkit-box-align:center;-webkit-box-pack:center;z-index:10000
}
.w-view .image-viewer{width: 1000px;height: 94%;background: #fff;position: relative;z-index: 5;padding-bottom: 40px;}
.w-view .black{position:absolute;left: 0;top: 0;width: 100%;height: 100%;opacity: .5;background: #000}
.w-view .w-view-contain{height: 94%;background: #fff;width: 1000px;position: relative;z-index:10;overflow: hidden;display:-webkit-box;-webkit-box-align:center;-webkit-box-pack:center}
// .w-view-contain img{max-width: 100%;max-height: 100%;display: block;margin: 0 auto;transition: all .5s;text-align: center}
.w-view-contain .pdf-view{width: 850px;max-height: 100%;margin: 0 auto;transition: all .5s;text-align: center}
.image-viewer .operate{background: #eee;position: absolute;left: 0;height: 40px;bottom: 0;color: $elm_theme-color;text-align: center;width: 100%;padding-top: 4px;line-height: 32px}
.image-viewer .operate i{font-size: 32px;text-align: center;cursor: pointer;margin-right: 20px}
.image-viewer .operate i:last-child{margin-right: 0}
.w-view-contain .pdf-view iframe{width: 90%}
.w-modify-select{color: #606266;}
.w-move-up{
    transform: rotate(-90deg);
    color:#ddd;
    font-weight: 800;
    margin: 0 20px;
}
.w-move-down{
    transform: rotate(90deg);
    color:#ddd;
    font-weight: 800;
}
.w-can-move:before{
    color: #5584FF;
    cursor: pointer;
}

.w-img-list{
  >div{
    width: 150px;
    height: 200px;
    display: inline-block;
    margin:0 20px 20px 0;
    position: relative;
    border:1px solid #ddd;
    border-radius:3px;
    .img-wraper{
      width: 148px;
      height: 148px;
      position: relative;
      img{
        max-width: 100%;
        max-height: 100%;
        width: auto;
        height: auto;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        position: absolute;
      }
    }
    >p{
      font-size: 14px;
      text-align: center;
      height: 40px;
      line-height: 40px;
      position: absolute;
      bottom:0;
      width: 100%;
    }
  }
}
.w-img-center{
  width: 100px;
  height: 100px;
  position: relative;
  margin: 10px 0;
  img{
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    position: absolute;
  }
}

.el-table .current-row{background: #b3d8ff}
